/* Base styles */
:root {
  --sl-color-text-accent: #ff7a00;
  --sl-color-banner-bg: #ffae49;
  --sl-color-banner-text: #000;
  font-size: 16px !important;
}

.sidebar-content a[aria-current="page"] {
  background-color: #ff7a00 !important;
  color: #0f172a !important;
}

.sidebar-content a:not([aria-current="page"]):hover,
.sidebar-content a:not([aria-current="page"]):focus-visible {
  color: #ff7a00 !important;
}

/* Desktop styles */
.starlight-content,
.starlight-content p,
.starlight-content li {
  font-size: 1.3rem !important;
  line-height: 1.7 !important;
}

.sl-markdown-content table td code { white-space: nowrap; }

/* Mobile styles */
@media screen and (max-width: 640px) {
  :root {
    font-size: 18px !important;
  }

  .starlight-content,
  .starlight-content p,
  .starlight-content li {
    font-size: 1.1rem !important;
    line-height: 1.6 !important;
  }

  .sidebar-content,
  .sidebar-content a,
  .sidebar-content li {
    font-size: 0.95rem !important;
  }

  /* Mobile heading sizes */
  .starlight-content h1 {
    font-size: 2rem !important;
    margin-bottom: 1.25rem !important;
  }

  .starlight-content h2 {
    font-size: 1.75rem !important;
    margin-bottom: 1rem !important;
  }

  .starlight-content h3 {
    font-size: 1.4rem !important;
    margin-bottom: 0.75rem !important;
  }
}

/* Other styles */
li details ul li .group-label span {
  font-size: 14px;
  text-transform: capitalize;
}

li details ul li details summary {
  padding-top: 8px;
  padding-bottom: 8px;
}

figcaption:not(.header) {
  background-color: var(--ec-caption-bg) !important;
  color: var(--ec-caption-text) !important;
  padding: 0rem 1rem 0.5rem 1rem !important;

  code {
    font-size: 13px !important;
    background-color: var(--ec-codeBg) !important;
    padding: 2px;
  }
}

figure figcaption:not(.header) {
  font-size: 14px !important;
  background-color: var(--sl-color-bg-inline-code) !important;
  color: var(--sl-color-text) !important;
}

/* Code captions */
figure:not(:has(> p))>figcaption:not(.header) {
  padding: 1rem 1rem 0.5rem 1rem !important;
  margin-top: -1rem !important;
  border-bottom: 1px solid var(--sl-color-gray-5) !important;
}

/* Image captions */
figure:has(> p)>figcaption:not(.header) {
  padding: 1rem 1rem 0.5rem 1rem !important;
  margin-top: -0.5rem !important;
  border-bottom: 1px solid var(--sl-color-gray-5) !important;
}

.output {
  background-color: var(--ec-caption-bg) !important;
}

caption {
  font-size: 14px !important;
}

:root {
  --sl-color-banner-bg: #ffae49;
  --sl-color-banner-text: #000;
}

/* Make headings more prominent */
.starlight-content h1 {
  font-size: 2.5rem !important;
  margin-bottom: 1.5rem !important;
}

.starlight-content h2 {
  font-size: 2rem !important;
  margin-bottom: 1.25rem !important;
}

.starlight-content h3 {
  font-size: 1.5rem !important;
  margin-bottom: 1rem !important;
}

/* Add a visible border to verify styles are loading */
.starlight-content {
  border: 2px solid red !important;
}
